<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>申请进度</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="../css/font.css">
    <link rel="stylesheet" href="../css/xadmin.css">
    <script type="text/javascript"
            src="../lib/vue/jquery.min.js"></script>
    <script type="text/javascript" src="../lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="../js/xadmin.js"></script>
    <script type="text/javascript" src="../js/global.js"></script>
    <script type="text/javascript" src="../js/store.js"></script>
    <script type="text/javascript" src="../js/cookies.js"></script>
    <script src="../lib/vue/vue.min.js"></script>
    <script src="../lib/vue/axios.min.js"></script>
    <style type="text/css">
        .package-status {
            padding: 18px 0 0 0
        }

        .package-status .status-list {
            margin: 0;
            padding: 0;
            margin-top: -5px;
            padding-left: 8px;
            list-style: none;
        }

        .package-status .status-list li {
            border-left: 2px solid #d9d9d9;
            text-align: left;
        }

        .package-status .status-list li:before { /* 流程点的样式 */
            content: '';
            border: 3px solid #f3f3f3;
            background-color: #d9d9d9;
            display: inline-block;
            width: 10px;
            height: 10px;
            border-radius: 10px;
            margin-left: -9px;
            margin-right: 10px
        }

        .package-status .status-list .latest:before {
            background-color: #0dad12;
            border-color: #f8e9e4;
        }

        .package-status .status-box {
            overflow: hidden
        }

        .package-status .status-list li {
            height: auto;
        }

        .package-status .status-list {
            margin-top: -8px
        }

        .package-status .status-box {
            position: relative
        }

        .package-status .status-box:before {
            content: " ";
            background-color: #f3f3f3;
            display: block;
            position: absolute;
            top: -8px;
            left: 20px;
            width: 10px;
            height: 4px
        }

        .package-status .status-list {
            margin-top: 0px;
        }

        /* .package-status .status-list .latest{border:none} */
        /* .package-status .status-list li{margin-bottom:-2px} */

        .status-list li:not(:first-child) {
            padding-top: 10px;
        }

        .status-content-before {
            text-align: left;
            margin-left: 25px;
            margin-top: -20px;
        }

        .status-content-latest {
            text-align: left;
            margin-left: 25px;
            color: green;
            margin-top: -20px;
        }

        .status-time-before {
            text-align: left;
            margin-left: 25px;
            font-size: 10px;
            margin-top: 5px;

        }

        .status-time-latest {
            text-align: left;
            margin-left: 25px;
            color: green;
            font-size: 10px;
            margin-top: 5px;
        }

        .status-line {
            border-bottom: 1px solid #ccc;
            margin-left: 25px;
            margin-top: 10px;
        }

    </style>
</head>
<body>
<div class="package-status" id="requestionDetail">
    <div id="detail" v-if="resultList">
        <ul class="status-list" v-for="item in resultList" @click="handleClick(item)">
            <li v-if="item.toUserType==2">
                <div class="status-content-before">您的申请已提交审核<h5>{{ item.createTime }}</h5></div>
                <div class="status-line"></div>
            </li>
            <li v-if="item.toUserType==2">
                <div class="status-content-before">公司管理员审核中<h5>{{ item.createTime }}</h5></div>
                <div class="status-time-before" v-if="item.handingResult==1"><h5 style="color: green">审核通过{{
                    item.updateTime }}</h5></div>
                <div class="status-time-before" v-if="item.handingResult==2"><h5 style="color: red">审核驳回{{
                    item.updateTime }}</h5></div>
                <div class="status-line"></div>
            </li>
            <li v-if="item.toUserType==3">
                <div class="status-content-before">组件管理员审核中<h5>{{ item.createTime }}</h5></div>
                <div class="status-time-before" v-if="item.handingResult==1"><h5 style="color: green">审核通过{{
                    item.updateTime }}</h5></div>
                <div class="status-time-before" v-if="item.handingResult==2"><h5 style="color: red">审核驳回{{
                    item.updateTime }}</h5></div>
                <div class="status-line"></div>
            </li>
            <li v-if="item.toUserType==4">
                <div class="status-content-before">超级管理员审核中<h5>{{ item.createTime }}</h5></div>
                <div class="status-time-before" v-if="item.handingResult==1"><h5 style="color: green">审核通过{{
                    item.updateTime }}</h5></div>
                <div class="status-time-before" v-if="item.handingResult==2"><h5 style="color: red">审核驳回{{
                    item.updateTime }}</h5></div>
                <div class="status-line"></div>
            </li>
        </ul>
    </div>
</div>
<script>
    var editData = parent.$("#editRequestion").val();
    var editArray = JSON.parse(editData);
    let vm = new Vue({
        el: '#requestionDetail',
        data() {
            return {
                applicationId: editArray.id,
                resultList: [],
                createTime1: '',
                createTime2: ''
            }
        },
        //渲染之前加载cookie数据
        beforeMount() {
            axios.get(_hostUrl + '/cmsCheckInfos/page/' + this.applicationId).then(response => {
                if (response.data.responseCode == 200) {
                    this.resultList = response.data.data.resultList;
                    /*    $.each(this.resultList, function (n, value) {
                            if(value.toUserType==2){
                                this.createTime1=value.createTime;
                                alert(this.createTime1)
                            }
                            if(value.toUserType==3){
                                this.createTime2=value.createTime;
                                alert(this.createTime2)
                            }
                        }
                        );*/
                }
            })
        }
    })
</script>
</body>
</html>